<style lang="scss">
.ivu-modal-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  .ivu-modal{
    top: 0;
  }
}
</style>
<template>
  <div class="content">
    <Breadcrumb>
      <BreadcrumbItem to="/index">首页</BreadcrumbItem>
      <BreadcrumbItem>考试列表</BreadcrumbItem>
    </Breadcrumb>
    <Table stripe row-key="id" :columns="columns" :data="data"></Table>
    <Page :current="current" :total="total" :page-size="pageSize" show-total show-sizer show-elevator :styles="{marginTop: '20px'}" @on-change="pageChange" @on-page-size-change="pageSizeChange" />
  </div>
</template>

<script>
export default {
  name: 'TestPaper',
  data: function () {
    return {
      columns: [
        {
          type: 'index'
        },
        {
          title: '考试标题',
          key: 'name'
        },
        {
          title: '开始时间',
          key: 'startTime'
        },
        {
          title: '时长',
          key: 'duration'
        },
        {
          title: '科目课程',
          render: (h, params) => h('div', {}, params.row.subject.parentName + ' ' + params.row.subject.name)
        },
        {
          title: '班级',
          render: (h, params) => h('div', {}, params.row.gradeClass.gradeName + ' ' + params.row.gradeClass.name)
        },
        {
          title: '状态',
          render: (h, params) => h('div', {}, params.row.status === 1 ? '未发布' : (params.row.status === 2 ? '已发布' : '已结束'))
        },
        {
          title: '创建时间',
          key: 'createTime'
        },
        {
          title: '操作',
          key: 'action',
          align: 'center',
          width: '260px',
          render: (h, params) => {
            return h('div', [
              h('Button', {
                props: {
                  type: 'warning',
                  size: 'small',
                },
                style: {
                  marginRight: '5px'
                },
                on: {
                  click: () => {
                    if(new Date().getTime() < new Date(params.row.startTime)) {
                      this.$Message.warning("考试未开始！")
                    }else {
                      this.$router.push(`/examination/${params.row.id}`)
                    }
                  }
                }
              }, '开始考试')
            ])
          }
        }
      ],
      data: [],
      total: 0,
      current: 1,
      pageSize: 10
    }
  },
  mounted () {
    this.getData()
  },
  methods: {
    getData() {
      this.$http.get(`getTestPaperByStudentId?pageNo=${this.current}&pageSize=${this.pageSize}`).then(res => {
        this.current = res.data.page.current
        this.total = res.data.page.total
        this.data = res.data.page.records
      })
    },
    pageChange(index) {
      this.current = index
      this.getData()
    },
    pageSizeChange(size) {
      this.current = 1
      this.pageSize = size
      this.getData()
    }
  }
}
</script>

<style scoped lang="scss">
form {
  margin-top: 20px;
}
</style>
